<title>pills选项卡</title>

<div class="content-header row">
	 <div class="content-header-left col-md-8 col-12 mb-2 breadcrumb-new">
	 	<h3 class="content-header-title mb-0 d-inline-block">pills选项卡</h3>
	 	<div class="row breadcrumbs-top d-inline-block">
	 		<div class="breadcrumb-wrapper mr-1">
	 			<ol class="breadcrumb">
	 				<li class="breadcrumb-item"><a href="/dashboard" class="menu-router">首页</a></li>
	 				<li class="breadcrumb-item"><a href="javascript:;">组件</a></li>
	 				<li class="breadcrumb-item active">pills选项卡</li>
	 			</ol>
	 		</div>
	 	</div>
	 </div>
</div>

<div class="content-body">
<!-- Basic Pills start -->
<section id="basic-pills">
	<div class="row match-height">
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Basic Pills</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Takes the basic nav pills from above and adds the <code>.nav-pills</code> class to generate a pilled interface. </p>
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link active" id="base-pill1" data-toggle="pill" href="#pill1" aria-expanded="true">Pill 1</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pill2" data-toggle="pill" href="#pill2" aria-expanded="false">Pill 2</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pill3" data-toggle="pill" href="#pill3" aria-expanded="false">Pill 3</a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled">Disabled</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="pill1" aria-expanded="true" aria-labelledby="base-pill1">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane" id="pill2" aria-labelledby="base-pill2">
								<p>Sugar plum tootsie roll biscuit caramels. Liquorice brownie pastry cotton candy oat cake fruitcake jelly chupa chups. Pudding caramels pastry powder cake soufflé wafer caramels. Jelly-o pie cupcake.</p>
							</div>
							<div class="tab-pane" id="pill3" aria-labelledby="base-pill3">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with dropdown</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>You can activate a pill navigation by simply specifying <code>data-toggle="pill"</code> on an element.</p>
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link" id="home-tab" data-toggle="pill" href="#home" aria-expanded="true">Home</a>
							</li>
							<li class="nav-item">
								<a class="nav-link active" id="profile-tab" data-toggle="pill" href="#profile" aria-expanded="false">Profile</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdown1-tab" href="#dropdown1" data-toggle="pill" aria-expanded="true">@fat</a>
									<a class="dropdown-item" id="dropdown2-tab" href="#dropdown2" data-toggle="pill" aria-expanded="true">@mdo</a>
								</div>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="about-tab" data-toggle="pill" href="#about" aria-expanded="false">About</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane" id="home" aria-labelledby="home-tab" aria-expanded="true">
								<p>Candy canes donut chupa chups candy canes lemon drops oat cake wafer. Cotton candy candy canes marzipan carrot cake. Sesame snaps lemon drops candy marzipan donut brownie tootsie roll. Icing croissant bonbon biscuit gummi bears.</p>
							</div>
							<div class="tab-pane active" id="profile" role="tabpanel" aria-labelledby="profile-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdown1" role="tabpanel" aria-labelledby="dropdown1-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdown2" role="tabpanel" aria-labelledby="dropdown2-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
							<div class="tab-pane" id="about" role="tabpanel" aria-labelledby="about-tab" aria-expanded="false">
								<p>Carrot cake dragée chocolate. Lemon drops ice cream wafer gummies dragée. Chocolate bar liquorice cheesecake cookie chupa chups marshmallow oat cake biscuit. Dessert toffee fruitcake ice cream powder tootsie roll cake.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Bordered Pills with Active Border</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use <code>.nav-pill-with-active-bordered</code> class to <code>.nav-pills</code> for bordered type pills. </p>
						<ul class="nav nav-pills nav-pill-with-active-bordered">
							<li class="nav-item">
								<a class="nav-link active" id="base-pill21" data-toggle="pill" href="#pill21" aria-expanded="true">Pill 1</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pill22" data-toggle="pill" href="#pill22" aria-expanded="false">Pill 2</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pill23" data-toggle="pill" href="#pill23" aria-expanded="false">Pill 3</a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled">Disabled</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="pill21" aria-expanded="true" aria-labelledby="base-pill21">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane" id="pill22" aria-labelledby="base-pill22">
								<p>Sugar plum tootsie roll biscuit caramels. Liquorice brownie pastry cotton candy oat cake fruitcake jelly chupa chups. Pudding caramels pastry powder cake soufflé wafer caramels. Jelly-o pie cupcake.</p>
							</div>
							<div class="tab-pane" id="pill23" aria-labelledby="base-pill23">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Bordered Pills with active border and dropdown</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use <code>.nav-pill-with-active-bordered</code> class to <code>.nav-pills</code> for bordered type pills. </p>
						<ul class="nav nav-pills nav-pill-with-active-bordered">
							<li class="nav-item">
								<a class="nav-link" id="home2-tab" data-toggle="pill" href="#home2" aria-expanded="true">Home</a>
							</li>
							<li class="nav-item">
								<a class="nav-link active" id="profile2-tab" data-toggle="pill" href="#profile2" aria-expanded="false">Profile</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdown21-tab" href="#dropdown21" data-toggle="pill" aria-expanded="true">@fat</a>
									<a class="dropdown-item" id="dropdown22-tab" href="#dropdown22" data-toggle="pill" aria-expanded="true">@mdo</a>
								</div>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="about2-tab" data-toggle="pill" href="#about2" aria-expanded="false">About</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane" id="home2" aria-labelledby="home2-tab" aria-expanded="true">
								<p>Candy canes donut chupa chups candy canes lemon drops oat cake wafer. Cotton candy candy canes marzipan carrot cake. Sesame snaps lemon drops candy marzipan donut brownie tootsie roll. Icing croissant bonbon biscuit gummi bears.</p>
							</div>
							<div class="tab-pane active" id="profile2" role="tabpanel" aria-labelledby="profile2-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdown21" role="tabpanel" aria-labelledby="dropdown21-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdown22" role="tabpanel" aria-labelledby="dropdown22-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
							<div class="tab-pane" id="about2" role="tabpanel" aria-labelledby="about2-tab" aria-expanded="false">
								<p>Carrot cake dragée chocolate. Lemon drops ice cream wafer gummies dragée. Chocolate bar liquorice cheesecake cookie chupa chups marshmallow oat cake biscuit. Dessert toffee fruitcake ice cream powder tootsie roll cake.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Basic Pills end -->


<!-- Justified Pills start -->
<section id="justified-pills">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">Justified Pills</h4>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Basic Justified Pills</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use <code>.nav-justified</code> class to set Pills justified.</p>
						<ul class="nav nav-pills nav-justified">
							<li class="nav-item">
								<a class="nav-link active" id="active-pill" data-toggle="pill" href="#active" aria-expanded="true">Active</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="link-pill" data-toggle="pill" href="#link" aria-expanded="false">Link</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownOpt1-pill" href="#dropdownOpt1" data-toggle="pill" aria-expanded="true">dropdown 1</a>
									<a class="dropdown-item" id="dropdownOpt2-pill" href="#dropdownOpt2" data-toggle="pill" aria-expanded="true">dropdown 2</a>
								</div>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="active" aria-labelledby="active-pill" aria-expanded="true">
								<p>Macaroon candy canes tootsie roll wafer lemon drops liquorice jelly-o tootsie roll cake. Marzipan liquorice soufflé cotton candy jelly cake jelly-o sugar plum marshmallow. Dessert cotton candy macaroon chocolate sugar plum cake donut.</p>
							</div>
							<div class="tab-pane" id="link" role="tabpanel" aria-labelledby="link-pill" aria-expanded="false">
								<p>Chocolate bar gummies sesame snaps. Liquorice cake sesame snaps cotton candy cake sweet brownie. Cotton candy candy canes brownie. Biscuit pudding sesame snaps pudding pudding sesame snaps biscuit tiramisu.</p>
							</div>
							<div class="tab-pane" id="dropdownOpt1" role="tabpanel" aria-labelledby="dropdownOpt1-pill" aria-expanded="false">
								<p>Fruitcake marshmallow donut wafer pastry chocolate topping cake. Powder powder gummi bears jelly beans. Gingerbread cake chocolate lollipop. Jelly oat cake pastry marshmallow sesame snaps.</p>
							</div>
							<div class="tab-pane" id="dropdownOpt2" role="tabpanel" aria-labelledby="dropdownOpt2-pill" aria-expanded="false">
								<p>Soufflé cake gingerbread apple pie sweet roll pudding. Sweet roll dragée topping cotton candy cake jelly beans. Pie lemon drops sweet pastry candy canes chocolate cake bear claw cotton candy wafer.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Justified Bordered Pills</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use <code>.nav-justified.nav-top-border.no-hover-bg</code> classes justified top bordered tabs. you can also use <code>.nav-topline</code> class place of <code>.nav-top-border</code> class</p>
						<ul class="nav nav-pills nav-pill-bordered nav-justified">
							<li class="nav-item">
								<a class="nav-link active" id="active-pill1" data-toggle="pill" href="#active1" aria-expanded="true">Active</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="link-pill1" data-toggle="pill" href="#link1" aria-expanded="false">Link</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownOpt2-pill1" href="#dropdownOpt11" data-toggle="pill" aria-expanded="true">dropdown 1</a>
									<a class="dropdown-item" id="dropdownOpt2-pill2" href="#dropdownOpt12" data-toggle="pill" aria-expanded="true">dropdown 2</a>
								</div>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="active1" aria-labelledby="active-pill1" aria-expanded="true">
								<p>Macaroon candy canes tootsie roll wafer lemon drops liquorice jelly-o tootsie roll cake. Marzipan liquorice soufflé cotton candy jelly cake jelly-o sugar plum marshmallow. Dessert cotton candy macaroon chocolate sugar plum cake donut.</p>
							</div>
							<div class="tab-pane" id="link1" role="tabpanel" aria-labelledby="link-pill1" aria-expanded="false">
								<p>Chocolate bar gummies sesame snaps. Liquorice cake sesame snaps cotton candy cake sweet brownie. Cotton candy candy canes brownie. Biscuit pudding sesame snaps pudding pudding sesame snaps biscuit tiramisu.</p>
							</div>
							<div class="tab-pane" id="dropdownOpt11" role="tabpanel" aria-labelledby="dropdownOpt2-pill1" aria-expanded="false">
								<p>Fruitcake marshmallow donut wafer pastry chocolate topping cake. Powder powder gummi bears jelly beans. Gingerbread cake chocolate lollipop. Jelly oat cake pastry marshmallow sesame snaps.</p>
							</div>
							<div class="tab-pane" id="dropdownOpt12" role="tabpanel" aria-labelledby="dropdownOpt2-pill2" aria-expanded="false">
								<p>Soufflé cake gingerbread apple pie sweet roll pudding. Sweet roll dragée topping cotton candy cake jelly beans. Pie lemon drops sweet pastry candy canes chocolate cake bear claw cotton candy wafer.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Active Bordered Justified Pills</h4>
				</div>
				<div class="card-body">
					<div class="card-block">
						<p>Use <code>.nav-justified.nav-pill-with-active-bordered</code> class for justified active bordered pills.</p>
						<ul class="nav nav-pills nav-pill-with-active-bordered nav-justified">
							<li class="nav-item">
								<a class="nav-link active" id="active11-pill" data-toggle="pill" href="#active11" aria-expanded="true">Active</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="link11-pill" data-toggle="pill" href="#link11" aria-expanded="false">Link</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownOpt011-pill1" href="#dropdownOpt011" data-toggle="pill" aria-expanded="true">dropdown 1</a>
									<a class="dropdown-item" id="dropdownOpt011-pill2" href="#dropdownOpt012" data-toggle="pill" aria-expanded="true">dropdown 2</a>
								</div>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="active11" aria-labelledby="active11-pill" aria-expanded="true">
								<p>Macaroon candy canes tootsie roll wafer lemon drops liquorice jelly-o tootsie roll cake. Marzipan liquorice soufflé cotton candy jelly cake jelly-o sugar plum marshmallow. Dessert cotton candy macaroon chocolate sugar plum cake donut.</p>
							</div>
							<div class="tab-pane" id="link11" role="tabpanel" aria-labelledby="link11-pill" aria-expanded="false">
								<p>Chocolate bar gummies sesame snaps. Liquorice cake sesame snaps cotton candy cake sweet brownie. Cotton candy candy canes brownie. Biscuit pudding sesame snaps pudding pudding sesame snaps biscuit tiramisu.</p>
							</div>
							<div class="tab-pane" id="dropdownOpt011" role="tabpanel" aria-labelledby="dropdownOpt011-pill1" aria-expanded="false">
								<p>Fruitcake marshmallow donut wafer pastry chocolate topping cake. Powder powder gummi bears jelly beans. Gingerbread cake chocolate lollipop. Jelly oat cake pastry marshmallow sesame snaps.</p>
							</div>
							<div class="tab-pane" id="dropdownOpt012" role="tabpanel" aria-labelledby="dropdownOpt011-pill2" aria-expanded="false">
								<p>Soufflé cake gingerbread apple pie sweet roll pudding. Sweet roll dragée topping cotton candy cake jelly beans. Pie lemon drops sweet pastry candy canes chocolate cake bear claw cotton candy wafer.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Justified Pills end -->



<!-- Pills Animations start -->
<section id="pills-animations">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">Pills Animations</h4>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with Fade</h4>
				</div>
				<div class="card-body">
					<div class="card-block">
						<p>Use class <code>.fade</code> for fade animation.</p>
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link active" id="base-pillOpt1" data-toggle="pill" href="#pillOpt1" aria-expanded="true">Pill 1</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pillOpt2" data-toggle="pill" href="#pillOpt2" aria-expanded="false">Pill 2</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pillOpt3" data-toggle="pill" href="#pillOpt3" aria-expanded="false">Pill 3</a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled">Disabled</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="pillOpt1" aria-expanded="true" aria-labelledby="base-pillOpt1">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane fade" id="pillOpt2" aria-labelledby="base-pillOpt2">
								<p>Sugar plum tootsie roll biscuit caramels. Liquorice brownie pastry cotton candy oat cake fruitcake jelly chupa chups. Pudding caramels pastry powder cake soufflé wafer caramels. Jelly-o pie cupcake.</p>
							</div>
							<div class="tab-pane fade" id="pillOpt3" aria-labelledby="base-pillOpt3">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with dropdown &amp; fade</h4>
				</div>
				<div class="card-body">
					<div class="card-block">
						<p>Use class <code>.fade</code> for fade animation.</p>
						<ul class="nav nav-pills nav-pill-bordered">
							<li class="nav-item">
								<a class="nav-link" id="homeOpt-tab" data-toggle="pill" href="#homeOpt" aria-expanded="true">Home</a>
							</li>
							<li class="nav-item">
								<a class="nav-link active" id="profileOpt-tab" data-toggle="pill" href="#profileOpt" aria-expanded="false">Profile</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownOption1-tab" href="#dropdownOption1" data-toggle="pill" aria-expanded="true">@fat</a>
									<a class="dropdown-item" id="dropdownOption2-tab" href="#dropdownOption2" data-toggle="pill" aria-expanded="true">@mdo</a>
								</div>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="aboutOpt-tab" data-toggle="pill" href="#aboutOpt" aria-expanded="false">About</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane fade" id="homeOpt" aria-labelledby="homeOpt-tab" aria-expanded="true">
								<p>Candy canes donut chupa chups candy canes lemon drops oat cake wafer. Cotton candy candy canes marzipan carrot cake. Sesame snaps lemon drops candy marzipan donut brownie tootsie roll. Icing croissant bonbon biscuit gummi bears.</p>
							</div>
							<div class="tab-pane active" id="profileOpt" role="tabpanel" aria-labelledby="profileOpt-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane fade" id="dropdownOption1" role="tabpanel" aria-labelledby="dropdownOption1-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane fade" id="dropdownOption2" role="tabpanel" aria-labelledby="dropdownOption2-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
							<div class="tab-pane fade" id="aboutOpt" role="tabpanel" aria-labelledby="aboutOpt-tab" aria-expanded="false">
								<p>Carrot cake dragée chocolate. Lemon drops ice cream wafer gummies dragée. Chocolate bar liquorice cheesecake cookie chupa chups marshmallow oat cake biscuit. Dessert toffee fruitcake ice cream powder tootsie roll cake.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Pills Animations end -->


<!-- Stacked Pills start -->
<section id="stacked-pills">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">Stacked Pills</h4>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Basic Stacked Pills</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use <code>.flex-column</code> class with <code>.nav.nav-pills</code> to stack them vertically. Each <code>.nav-link</code> becomes block-level, allowing for larger hit areas via mouse or tap. </p>
						<ul class="nav nav-pills flex-column">
							<li class="nav-item">
								<a class="nav-link active" id="base-pillOpt21" data-toggle="pill" href="#pillOpt21" aria-expanded="true">Pill 1</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pillOpt22" data-toggle="pill" href="#pillOpt22" aria-expanded="false">Pill 2</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pillOpt23" data-toggle="pill" href="#pillOpt23" aria-expanded="false">Pill 3</a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled">Disabled</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Stacked Pills with dropdown</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use <code>.flex-column</code> class with <code>.nav.nav-pills</code> to stack them vertically. Each <code>.nav-link</code> becomes block-level, allowing for larger hit areas via mouse or tap. </p>
						<ul class="nav nav-pills flex-column">
							<li class="nav-item">
								<a class="nav-link active" id="homeOpt21-tab" data-toggle="pill" href="#homeOpt21" aria-expanded="true">Home</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="profileOpt21-tab" data-toggle="pill" href="#profileOpt21" aria-expanded="false">Profile</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownOption21-tab" href="#dropdownOption21" data-toggle="pill" aria-expanded="true">@fat</a>
									<a class="dropdown-item" id="dropdownOption22-tab" href="#dropdownOption22" data-toggle="pill" aria-expanded="true">@mdo</a>
								</div>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="aboutOpt21-tab" data-toggle="pill" href="#aboutOpt21" aria-expanded="false">About</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Stacked Pills end -->

<!-- Pills Elements start -->
<section id="pills-elements">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">Pills Elements</h4>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with Left Icon</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use font icons before pill name to get pills with icon.</p>
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link active" id="base-pillEle1" data-toggle="pill" href="#pillEle1" aria-expanded="true"><i class="ft-calendar"></i> Pill 1</a>
							</li>
							<li class="nav-item">
							<a class="nav-link" id="base-pillEle3" data-toggle="pill" href="#pillEle3" aria-expanded="false"><i class="ft-layout"></i> Pill 3</a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled"><i class="ft-x-circle"></i> Disabled</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active show" id="pillEle1" aria-expanded="true" aria-labelledby="base-pillEle1">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane" id="pillEle3" aria-labelledby="base-pillEle3">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with dropdown &amp; Left Icon</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Use font icons before pill name to get pills with icon.</p>
						<ul class="nav nav-pills nav-justified">
							<li class="nav-item">
							<a class="nav-link" id="homeEle-tab" data-toggle="pill" href="#homeEle" aria-expanded="true"><i class="la la-home"></i> Home</a>
							</li>
							<li class="nav-item">
							<a class="nav-link active" id="profileEle-tab" data-toggle="pill" href="#profileEle" aria-expanded="false"><i class="la la-user"></i> Profile</a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								<i class="ft-package"></i> Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownEle1-tab" href="#dropdownEle1" data-toggle="pill" aria-expanded="true"><i class="la la-fighter-jet"></i> @fat</a>
									<a class="dropdown-item" id="dropdownEle2-tab" href="#dropdownEle2" data-toggle="pill" aria-expanded="true"><i class="la la-fighter-jet"></i> @mdo</a>
								</div>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane" id="homeEle" aria-labelledby="homeEle-tab" aria-expanded="true">
								<p>Candy canes donut chupa chups candy canes lemon drops oat cake wafer. Cotton candy candy canes marzipan carrot cake. Sesame snaps lemon drops candy marzipan donut brownie tootsie roll. Icing croissant bonbon biscuit gummi bears.</p>
							</div>
							<div class="tab-pane active show" id="profileEle" role="tabpanel" aria-labelledby="profileEle-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdownEle1" role="tabpanel" aria-labelledby="dropdownEle1-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdownEle2" role="tabpanel" aria-labelledby="dropdownEle2-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with Right Icon</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link active" id="base-pillEle11" data-toggle="pill" href="#pillEle11" aria-expanded="true">Pill 1 <i class="ml-1 ft-calendar"></i></a>
							</li>
							<li class="nav-item">
							<a class="nav-link" id="base-pillEle13" data-toggle="pill" href="#pillEle13" aria-expanded="false">Pill 3 <i class="ml-1 ft-layout"></i></a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled">Disabled <i class="ml-1 ft-x-circle"></i></a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active show" id="pillEle11" aria-expanded="true" aria-labelledby="base-pillEle11">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane" id="pillEle13" aria-labelledby="base-pillEle13">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with dropdown &amp; Right Icon</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<ul class="nav nav-pills nav-justified">
							<li class="nav-item">
							<a class="nav-link" id="homeEle1-tab" data-toggle="pill" href="#homeEle1" aria-expanded="true">Home <i class="ml-1 la la-home"></i></a>
							</li>
							<li class="nav-item">
								<a class="nav-link active" id="profileEle1-tab" data-toggle="pill" href="#profileEle1" aria-expanded="false">Profile <i class="ml-1 la la-user"></i></a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								Dropdown <i class="ml-1 ft-package"></i>
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownEle11-tab" href="#dropdownEle11" data-toggle="pill" aria-expanded="true">@fat <i class="ml-1 la la-fighter-jet"></i></a>
									<a class="dropdown-item" id="dropdownEle12-tab" href="#dropdownEle12" data-toggle="pill" aria-expanded="true">@mdo <i class="ml-1 la la-fighter-jet"></i></a>
								</div>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane" id="homeEle1" aria-labelledby="homeEle1-tab" aria-expanded="true">
								<p>Candy canes donut chupa chups candy canes lemon drops oat cake wafer. Cotton candy candy canes marzipan carrot cake. Sesame snaps lemon drops candy marzipan donut brownie tootsie roll. Icing croissant bonbon biscuit gummi bears.</p>
							</div>
							<div class="tab-pane active show" id="profileEle1" role="tabpanel" aria-labelledby="profileEle1-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdownEle11" role="tabpanel" aria-labelledby="dropdownEle11-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane" id="dropdownEle12" role="tabpanel" aria-labelledby="dropdownEle12-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with Label</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>You can also use <code>.badge.badge-COLOR</code> classes to add label to pill.</p>
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link active" id="base-pillEle31" data-toggle="pill" href="#pillEle31" aria-expanded="true"><span class="badge badge-default badge-success">New</span> Pill 1</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pillEle33" data-toggle="pill" href="#pillEle33" aria-expanded="false">Pill 3 <span class="badge badge-default badge-danger ml-1">Bug</span></a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled"><span class="badge badge-default badge-info">Info</span> Disabled</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="pillEle31" aria-expanded="true" aria-labelledby="base-pillEle31">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane fade" id="pillEle33" aria-labelledby="base-pillEle33">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with dropdown &amp; Label</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>You can also use <code>.badge.badge-COLOR</code> classes to add label to pill.</p>
						<ul class="nav nav-pills nav-justified">
							<li class="nav-item">
								<a class="nav-link active" id="profileEle3-tab" data-toggle="pill" href="#profileEle3" aria-expanded="false">Profile <span class="badge badge-default badge-success ml-1">New</span></a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								<span class="badge badge-default badge-warning">Fixed</span>
								Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownEle31-tab" href="#dropdownEle31" data-toggle="pill" aria-expanded="true"><i class="la la-fighter-jet"></i> @fat</a>
									<a class="dropdown-item" id="dropdownEle32-tab" href="#dropdownEle32" data-toggle="pill" aria-expanded="true"><i class="la la-fighter-jet"></i> @mdo</a>
								</div>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="aboutEle3-tab" data-toggle="pill" href="#aboutEle3" aria-expanded="false">About <span class="badge badge-default badge-info ml-1">Info</span></a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div class="tab-pane active" id="profileEle3" role="tabpanel" aria-labelledby="profileEle3-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane fade" id="dropdownEle31" role="tabpanel" aria-labelledby="dropdownEle31-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane fade" id="dropdownEle32" role="tabpanel" aria-labelledby="dropdownEle32-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
							<div class="tab-pane fade" id="aboutEle3" role="tabpanel" aria-labelledby="aboutEle3-tab" aria-expanded="false">
								<p>Carrot cake dragée chocolate. Lemon drops ice cream wafer gummies dragée. Chocolate bar liquorice cheesecake cookie chupa chups marshmallow oat cake biscuit. Dessert toffee fruitcake ice cream powder tootsie roll cake.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with Label</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>You can also use <code>.badge.badge-pill.badge-glow.badge-COLOR</code> classes to add label pill(badge) to pill.</p>
						<ul class="nav nav-pills">
							<li class="nav-item">
								<a class="nav-link active" id="base-pillEle41" data-toggle="pill" href="#pillEle41" aria-expanded="true"><span class="badge badge-pill badge-glow badge-default badge-success">2</span> Pill 1</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="base-pillEle43" data-toggle="pill" href="#pillEle43" aria-expanded="false">Pill 3 <span class="badge badge-pill badge-glow badge-default badge-danger ml-1">7</span></a>
							</li>
							<li class="nav-item">
								<a class="nav-link disabled"><span class="badge badge-pill badge-glow badge-default badge-info">1</span> Disabled</a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div role="tabpanel" class="tab-pane active" id="pillEle41" aria-expanded="true" aria-labelledby="base-pillEle41">
								<p>Oat cake marzipan cake lollipop caramels wafer pie jelly beans. Icing halvah chocolate cake carrot cake. Jelly beans carrot cake marshmallow gingerbread chocolate cake. Gummies cupcake croissant.</p>
							</div>
							<div class="tab-pane fade" id="pillEle43" aria-labelledby="base-pillEle43">
								<p>Biscuit ice cream halvah candy canes bear claw ice cream cake chocolate bar donut. Toffee cotton candy liquorice. Oat cake lemon drops gingerbread dessert caramels. Sweet dessert jujubes powder sweet sesame snaps.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-6 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Pills with dropdown &amp; Label</h4>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>You can also use <code>.badge.badge-pill.badge-glow.badge-COLOR</code> classes to add label pill(badge) to pill.</p>
						<ul class="nav nav-pills nav-justified">							
							<li class="nav-item">
								<a class="nav-link active" id="profileEle4-tab" data-toggle="pill" href="#profileEle4" aria-expanded="false">Profile <span class="badge badge-pill badge-glow badge-default badge-success ml-1">2</span></a>
							</li>
							<li class="nav-item dropdown">
								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
								<span class="badge badge-pill badge-glow badge-default badge-warning">1</span> Dropdown
								</a>
								<div class="dropdown-menu">
									<a class="dropdown-item" id="dropdownEle41-tab" href="#dropdownEle41" data-toggle="pill" aria-expanded="true"><i class="la la-fighter-jet"></i> @fat</a>
									<a class="dropdown-item" id="dropdownEle42-tab" href="#dropdownEle42" data-toggle="pill" aria-expanded="true"><i class="la la-fighter-jet"></i> @mdo</a>
								</div>
							</li>
							<li class="nav-item">
								<a class="nav-link" id="aboutEle4-tab" data-toggle="pill" href="#aboutEle4" aria-expanded="false">About <span class="badge badge-pill badge-glow badge-default badge-info ml-1">6</span></a>
							</li>
						</ul>
						<div class="tab-content px-1 pt-1">
							<div class="tab-pane active" id="profileEle4" role="tabpanel" aria-labelledby="profileEle4-tab" aria-expanded="false">
								<p>Pudding candy canes sugar plum cookie chocolate cake powder croissant. Carrot cake tiramisu danish candy cake muffin croissant tart dessert. Tiramisu caramels candy canes chocolate cake sweet roll liquorice icing cupcake.</p>
							</div>
							<div class="tab-pane fade" id="dropdownEle41" role="tabpanel" aria-labelledby="dropdownEle41-tab" aria-expanded="false">
								<p>Cake croissant lemon drops gummi bears carrot cake biscuit cupcake croissant. Macaroon lemon drops muffin jelly sugar plum chocolate cupcake danish icing. Soufflé tootsie roll lemon drops sweet roll cake icing cookie halvah cupcake.</p>
							</div>
							<div class="tab-pane fade" id="dropdownEle42" role="tabpanel" aria-labelledby="dropdownEle42-tab" aria-expanded="false">
								<p>Chocolate croissant cupcake croissant jelly donut. Cheesecake toffee apple pie chocolate bar biscuit tart croissant. Lemon drops danish cookie. Oat cake macaroon icing tart lollipop cookie sweet bear claw.</p>
							</div>
							<div class="tab-pane fade" id="aboutEle4" role="tabpanel" aria-labelledby="aboutEle4-tab" aria-expanded="false">
								<p>Carrot cake dragée chocolate. Lemon drops ice cream wafer gummies dragée. Chocolate bar liquorice cheesecake cookie chupa chups marshmallow oat cake biscuit. Dessert toffee fruitcake ice cream powder tootsie roll cake.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Pills Elements end -->
</div>

<script type="text/javascript">
	
</script>